﻿pre {
    margin: 0;
    font-family: 'Cascadia Mono', 'Courier New';
}

pre code.hljs {
    display: block;
    padding: 1em;
}

code.hljs {
    padding: 3px 5px;
}

.hljs {
    background-color: transparent;
    color: $body-color;
}

.hljs-keyword, .hljs-literal, .hljs-name, .hljs-symbol {
    color: $blue;
}

.hljs-link {
    color: #569cd6;
    text-decoration: underline;
}

.hljs-built_in, .hljs-type {
    color: $blue;
}

.hljs-class, .hljs-number {
    color: $body-color;
}

.hljs-meta .hljs-string, .hljs-string {
    color: $red;
}

.hljs-regexp, .hljs-template-tag {
    color: #9a5334
}

.hljs-formula, .hljs-function, .hljs-params, .hljs-subst, .hljs-title {
    color: $teal;
}

.hljs-comment, .hljs-quote {
    color: #608b4e;
    font-style: italic;
}

.hljs-doctag {
    color: #969896;
}

.hljs-meta, .hljs-meta .hljs-keyword, .hljs-tag {
    color: #9b9b9b
}

.hljs-template-variable, .hljs-variable {
    color: #bd63c5
}

.hljs-attr, .hljs-attribute {
    color: $body-color;
}

.hljs-section {
    color: gold
}

.hljs-emphasis {
    font-style: italic
}

.hljs-strong {
    font-weight: 700
}

.hljs-bullet, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id, .hljs-selector-pseudo, .hljs-selector-tag {
    color: #d7ba7d
}

.hljs-addition {
    background-color: #144212;
    display: inline-block;
    width: 100%
}

.hljs-deletion {
    background-color: #600;
    display: inline-block;
    width: 100%
}

/* for block of numbers */
.hljs-ln {
    .hljs-ln-numbers {
        user-select: none;
        text-align: center;
        color: $teal;
        vertical-align: top;
    }

    .hljs-ln-code {
        padding-left: 0.5rem;
    }
}

.CodeMirror {
    border: 1px solid $input-border-color;
    border-radius: $input-border-radius;

    .CodeMirror-gutters {
        border-color: $input-border-color;
    }
}

.CodeMirror-border-none .CodeMirror {
    border: 0;
    border-radius: 0;
}

.CodeMirror-border-bottom .CodeMirror {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
}

.CodeMirror-vscrollbar, .CodeMirror-hscrollbar {
    @extend %scrollbar;
}
